import React, { Component } from 'react'
import { HashRouter, Route, Link } from 'react-router-dom'
import './sjsou.scss'



import yglife from '../../../img2/lglife.png'
import sou from '../../../img2/sou.png'
import ss from '../../../img2/ss.png'
import my from '../../../img2/my.png'
import che from '../../../img2/che.png'
import qq from '../../../img2/qq1.png'
import c1 from '../../../img2/c1.png'
import c2 from '../../../img2/c2.png'
import c3 from '../../../img2/c3.png'
import c4 from '../../../img2/c4.png'
import Head from '../../components1/head/head'
import Foot from '../../components3/foot/foot'


export default class sjsou extends Component {
    constructor(props) {
        super(props)
        this.state = {
            bol: false,
            val: '空',
        }
    }

    back(e) {
        this.setState({
            bol: !this.state.bol
        });
        if(e.target.innerText==='商品'){
            this.props.history.push('/home')
        }
    }

    render() {
        return (
            <div className="sou-body">
                <Head  history={this.props.history}/>
                <div className="nav-head">
                    <div className="nav-con">
                        <div className="nav-con-t">
                            {/* 左侧图标 */}
                            <img src={yglife} alt="" />
                            <div>
                                <div className="nav-tab"><span onClick={this.back.bind(this)} className={this.state.bol ? 'col-back' : null}>商品</span><span onClick={this.back.bind(this)} className={this.state.bol ? null : 'col-back'}>商家</span></div>
                                <div className="nav-sou">
                                    <input type="text" value="海澜之家旗舰店" /><em><img src={sou} alt="" />搜易和</em>
                                    <i>搜本店</i>
                                    <span className="nav-sou-span"><img src={my} /> <HashRouter>
                                        <Link to='/text'>我的易和</Link>
                                        <Route path='/text' component={Text}></Route>
                                    </HashRouter><img src={ss} /> </span><span><img src={che} /><HashRouter>
                                        <Link to='/text'>购物车</Link>
                                        <Route path='/text' component={Text}></Route>
                                    </HashRouter><i>0</i><img src={ss} /> </span>
                                </div>
                                <p>热门:<i>酒店</i>
                                    <i>洗车</i>
                                    <i>餐饮</i>
                                    <i>进口 </i>
                                    <i>如家</i></p>
                            </div>
                        </div>
                        <div className="nav-con-b">
                            <div className="nav-cc">
                                <div className="nav-cct">行业分类</div>
                                <div className="nav-ccb">
                                    <div className="yil">
                                        <HashRouter>
                                            <Link to='/text'>餐饮</Link>
                                            <Route path='/text' component={Text}></Route>
                                        </HashRouter>
                                        <div className="yyr">
                                            <HashRouter>
                                                <Link to='/text'>新疆菜</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter><HashRouter>|
                                                <Link to='/text'>四川菜</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter>
                                        </div>
                                    </div>
                                    {/* 002 */}
                                    <div className="yil">
                                        <HashRouter>
                                            <Link to='/text'>服饰</Link>
                                            <Route path='/text' component={Text}></Route>
                                        </HashRouter>
                                        <div className="yyr">
                                            <HashRouter>
                                                <Link to='/text'>外套</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter><HashRouter>|
                                                <Link to='/text'>裤子</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter>
                                        </div>
                                    </div>
                                    {/* 003 */}
                                    <div className="yil">
                                        <HashRouter>
                                            <Link to='/text'>娱乐</Link>
                                            <Route path='/text' component={Text}></Route>
                                        </HashRouter>
                                        <div className="yyr">
                                            <HashRouter>
                                                <Link to='/text'>洗澡</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter><HashRouter>|
                                                <Link to='/text'>按摩</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter>
                                        </div>
                                    </div>
                                    {/*  004*/}
                                    <div className="yil">
                                        <HashRouter>
                                            <Link to='/text'>家具</Link>
                                            <Route path='/text' component={Text}></Route>
                                        </HashRouter>
                                        <div className="yyr">
                                            <HashRouter>
                                                <Link to='/text'>沙发</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter><HashRouter>|
                                                <Link to='/text'>席梦思</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter>
                                        </div>
                                    </div>
                                    {/* 005 */}
                                    <div className="yil">
                                        <HashRouter>
                                            <Link to='/text'>零售</Link>
                                            <Route path='/text' component={Text}></Route>
                                        </HashRouter>
                                        <div className="yyr">
                                            <HashRouter>
                                                <Link to='/text'>花生</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter><HashRouter>|
                                                <Link to='/text'>瓜子</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter>
                                        </div>
                                    </div>
                                    {/* 006 */}
                                    <div className="yil">
                                        <HashRouter>
                                            <Link to='/text'>日化</Link>
                                            <Route path='/text' component={Text}></Route>
                                        </HashRouter>
                                        <div className="yyr">
                                            <HashRouter>
                                                <Link to='/text'>水乳</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter><HashRouter>
                                                <Link to='/text'>BB霜</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter>
                                        </div>
                                    </div>
                                    {/* 007 */}
                                    <div className="yil">
                                        <HashRouter>
                                            <Link to='/text'>数码家电</Link>
                                            <Route path='/text' component={Text}></Route>
                                        </HashRouter>
                                        <div className="yyr">
                                            <HashRouter>
                                                <Link to='/text'>电脑</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter><HashRouter>|
                                                <Link to='/text'>手机</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter>
                                        </div>
                                    </div>
                                    {/* 008 */}
                                    <div className="yil">
                                        <HashRouter>
                                            <Link to='/text'>建材</Link>
                                            <Route path='/text' component={Text}></Route>
                                        </HashRouter>
                                        <div className="yyr">
                                            <HashRouter>
                                                <Link to='/text'>钢筋</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter><HashRouter>|
                                                <Link to='/text'>水泥</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter>
                                        </div>
                                    </div>
                                    {/* 009 */}
                                    <div className="yil">
                                        <HashRouter>
                                            <Link to='/text'>酒店</Link>
                                            <Route path='/text' component={Text}></Route>
                                        </HashRouter>
                                        <div className="yyr">
                                            <HashRouter>
                                                <Link to='/text'>亚特兰蒂斯</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter><HashRouter>|
                                                <Link to='/text'>尚客优</Link>
                                                <Route path='/text' component={Text}></Route>
                                            </HashRouter>
                                        </div>
                                    </div>
                                    {/* 009end */}
                                </div>
                            </div>
                            <div className="nav-lianjie">
                                <HashRouter>
                                    <Link to='/text'>首页</Link>
                                    <Route path='/text' component={Text}></Route>
                                </HashRouter>
                                <HashRouter>
                                    <Link to='/text'>精选品牌</Link>
                                    <Route path='/text' component={Text}></Route>
                                </HashRouter>
                                <HashRouter>
                                    <Link to='/text'>今日特价</Link>
                                    <Route path='/text' component={Text}></Route>
                                </HashRouter>

                                <HashRouter>
                                    <Link to='/text'>积分商城</Link>
                                    <Route path='/text' component={Text}></Route>
                                </HashRouter>
                                <HashRouter>
                                    <Link to='/text'>加入易和</Link>
                                    <Route path='/text' component={Text}></Route>
                                </HashRouter>
                                <HashRouter>
                                    <Link className="nav-server" to='/text'>
                                        在线客服
                                        <div className="nav-kefu">
                                            <div> <img src={qq} alt="" />QQ客服1</div>
                                            <div> <img src={qq} alt="" />QQ客服2</div>
                                            <div> <img src={qq} alt="" />QQ客服3</div>
                                        </div>
                                    </Link>
                                    <Route path='/text' component={Text}></Route>
                                </HashRouter>
                        </div></div></div></div>
                {/* 头部结束 */}
                <div className="shen-local-bg">
                <div className="shen-local">
                    您当前的位置：搜索 {'>'} <span>海澜之家旗舰店</span>
                </div>
               <ul className="sou-ul-list">
                   <li>
                       <Link to="/shangjia"><img src={c1} alt=""/></Link>
                       <div><img src={c2} alt=""/>李杰</div>
                       <div><img src={c3} alt=""/>1822222222</div>
                       <div><img src={c4} alt=""/>浙江省台州市温岭市人民西路281号浙江省台州市温岭市人民西路281号</div>

                   </li>
                   <li>
                       <img src={c1} alt=""/>
                       <div><img src={c2} alt=""/>李杰</div>
                       <div><img src={c3} alt=""/>1822222222</div>
                       <div><img src={c4} alt=""/>浙江省台州市温岭市人民西路281号浙江省台州市温岭市人民西路281号</div>

                   </li>
                   <li>
                       <img src={c1} alt=""/>
                       <div><img src={c2} alt=""/>李杰</div>
                       <div><img src={c3} alt=""/>1822222222</div>
                       <div><img src={c4} alt=""/>浙江省台州市温岭市人民西路281号浙江省台州市温岭市人民西路281号</div>

                   </li>
                   <li>
                       <img src={c1} alt=""/>
                       <div><img src={c2} alt=""/>李杰</div>
                       <div><img src={c3} alt=""/>1822222222</div>
                       <div><img src={c4} alt=""/>浙江省台州市温岭市人民西路281号浙江省台州市温岭市人民西路281号</div>

                   </li>
                   <li>
                       <img src={c1} alt=""/>
                       <div><img src={c2} alt=""/>李杰</div>
                       <div><img src={c3} alt=""/>1822222222</div>
                       <div><img src={c4} alt=""/>浙江省台州市温岭市人民西路281号浙江省台州市温岭市人民西路281号</div>

                   </li>
                   <li>
                       <img src={c1} alt=""/>
                       <div><img src={c2} alt=""/>李杰</div>
                       <div><img src={c3} alt=""/>1822222222</div>
                       <div><img src={c4} alt=""/>浙江省台州市温岭市人民西路281号浙江省台州市温岭市人民西路281号</div>

                   </li>

               </ul>
               </div>
            <Foot/>
            </div>
        )
    }
}
